Feature/#111 news notice UI #116

Eonji-sw · 2024-11-24T08:44:05Z

✅ 𝗖𝗵𝗲𝗰𝗸-𝗟𝗶𝘀𝘁

merge할 브랜치의 위치를 확인해 주세요(main❌/develop⭕)
리뷰가 필요한 경우 리뷰어를 지정해 주세요
P1 단계의 리뷰는 필수로 반영합니다.
Approve된 PR은 assigner가 머지하고, 수정 요청이 온 경우 수정 후 다시 push를 합니다.

📌 𝗜𝘀𝘀𝘂𝗲𝘀

closed [FEAT] : 소식 공지사항 탭 UI 구현 #111

📎𝗪𝗼𝗿𝗸 𝗗𝗲𝘀𝗰𝗿𝗶𝗽𝘁𝗶𝗼𝗻

공지사항 탭 UI 구현

📷 𝗦𝗰𝗿𝗲𝗲𝗻𝘀𝗵𝗼𝘁

2024-11-24.5.41.04.mov

💬 𝗧𝗼 𝗥𝗲𝘃𝗶𝗲𝘄𝗲𝗿𝘀

귀찮아서 영상 안자르고 했더니 좀 길어여..

chanubc

대충 설명드렸는데 엄청 잘하셨네요 짱!

feature/news/src/main/java/com/teamwable/news/NewsViewModel.kt

chanubc · 2024-11-24T09:50:47Z

feature/news/src/main/java/com/teamwable/news/notice/NewsNoticeFragment.kt

+        val parentNavController = requireParentFragment().findNavController()
+        val action = NewsFragmentDirections.actionNavigationNewsToNavigationNewsDetail(notice)
+        parentNavController.navigate(action)


와 parent거 가져오는 법은 처음알았네요 짱!

허덕이다가.. 사용해보았슴다

feature/news/src/main/java/com/teamwable/news/notice/NewsNoticeItem.kt

chanubc · 2024-11-24T09:58:09Z

feature/news/src/main/java/com/teamwable/news/notice/NewsNoticeItem.kt

+@RequiresApi(Build.VERSION_CODES.O)
+@Composable
+fun NewsNoticeItem(context: Context, data: NewsInfoModel, navigateToDetail: (NewsInfoModel) -> Unit) {
+    Box(modifier = Modifier.clickable { navigateToDetail(data) }) {


p1 : 우리는 따로 리플 효과가 없기 때문에

package com.teamwable.designsystem.extension.modifier

여기에 noRippleDebounceClickable 확장함수를 만들었는데 이거 사용해주세요!

죄송합니다 이걸 쓰면 pointerInteropFilter가 lazycolumn의 스크롤 모션을 방해해서 무조건 터치만 되고 다음화면으로 넘어가게 되네요 noRippleClickable이나 그냥 clickable 써도 좋을것 같아요!

오호라 그렇군요..

chanubc · 2024-11-24T10:01:03Z

feature/news/src/main/java/com/teamwable/news/notice/NewsNoticeRoute.kt

+) {
+    val context = LocalContext.current
+
+    viewModel.dummyNotice.apply {


p1 :이건 추후에 서버통신하면서 state를 collect하는 방식으로 바꾸어주세요!

val showEmptyText by viewModel.showDialog.collectAsStateWithLifecycle()

이런식으로요! 네이밍은 알잘딱갈센으로~

지금 구조에서는 List의 값을 직접가져오는 식인데
컴포저블에서는 List의 경우 unstatble로 간주( 왜냐면 list는 값을 변경할 수 있으니까 MutableList를 넣을수 있기때문) 되기에 리컴포지션의 원인이 됩니다!

ImmutableList와 PersistentList를 사용가능하도록 라이브러리를 설치 해놓았습니다~

넹 서버통신 할 때 적용해볼게용 ^.<

feature/news/src/main/java/com/teamwable/news/notice/NewsNoticeItem.kt

feature/news/src/main/java/com/teamwable/news/notice/NewsNoticeRoute.kt

chanubc · 2024-11-24T10:07:26Z

feature/news/src/main/java/com/teamwable/news/notice/NewsNoticeRoute.kt

+) {
+    Box(modifier = Modifier.fillMaxSize()) {
+        LazyColumn(modifier = Modifier.fillMaxSize()) {
+            items(notices) { notice ->


p1 :

Suggested change

items(notices) { notice ->

items(items = notices, key = {item -> item.id}) {

이런식으로 LazyColumn에서는 key를 명시해주어야 스크롤 시에 재사용 되는 컴포저블 뷰(item)이 stable로 인식하고 리컴포지션을 유발하지 않는 것으로 알고 잇어요!

그리고 여기서 Box와 LazyColuunm모두 fillMaxSize()가 되어있는데 fillMaxWidth()를 재사용가능한 컴포저블에 적용하게 되면 재사용 가능한 컴포저블은 부모레이아웃의 항상 전체 너비를 차지하므로 옆으로 배치한다거나, 크기를 조정 가능한 유연성을 잃을 수 잇어요!

재사용 가능한 컴포저블에서는 최상위 레벨에 크기를 강제하는 Modifier를 생략하고, 크기 관련 Modifier는 호출 시점에 외부에서 제공하는것이 낫습니다.

배차은우 그는 이제 컴포즈 장인이 되어 버렸다 ..

아 맞아요 34기에 들었던 기억이 있는데
전 불필요한 컴포지션이 너무 싫어요... 근데 줄이는게 너무 빡셈 ^^;
좋은 자료 감사해용 굿

feature/news/src/main/java/com/teamwable/news/notice/NewsNoticeRoute.kt

feature/news/src/main/java/com/teamwable/news/NewsViewModel.kt

feature/news/src/main/java/com/teamwable/news/notice/NewsNoticeFragment.kt

sohyun127 · 2024-11-24T16:59:04Z

feature/news/src/main/java/com/teamwable/news/notice/NewsNoticeRoute.kt

+) {
+    Box(modifier = Modifier.fillMaxSize()) {
+        LazyColumn(modifier = Modifier.fillMaxSize()) {
+            items(notices) { notice ->


배차은우 그는 이제 컴포즈 장인이 되어 버렸다 ..

chanubc

수고했슴둥!

feature/news/src/main/java/com/teamwable/news/notice/NewsNoticeRoute.kt

feature/news/src/main/java/com/teamwable/news/notice/NewsNoticeItem.kt

sohyun127 · 2024-11-24T17:47:24Z

고생했다 !!! LGTM 기먼지 💯

Eonji-sw added 11 commits November 24, 2024 17:29

#111 [UI] : news 상단바 lottie background color 변경

5b6aff1

#111 [UI] : news_detail fragment UI 생성

868bab3

#111 [UI] : news_notice fragment UI composeView 구현

950f8aa

#111 [UI] : news graph notice -> detail 이동 추가

fc03e98

#111 [FEAT] : NewsDetailFragment 구현

b19fa3d

#111 [MOD] : NewsInfoModel parcelize 적용

450ef39

#111 [FEAT] : NewsNoticeFragment compose 적용 및 navi 함수 구현

ec4ece9

#111 [UI] : NewsNoticeItem UI 구현

3cd6473

#111 [FEAT] : NewsNotice Route 및 Screen 구현

2d44674

#111 [MOD] : notice dummy 데이터 추가

fe301f9

#111 [UI] : string export

1bd1218

Eonji-sw added ⭐ [FEAT] 새로운 기능 구현 💟 [UI] UI 작업 xml 파일 건들면 요거 🐰 언지 기만지 ☕ [COMPOSE] 컴포즈 ui labels Nov 24, 2024

Eonji-sw self-assigned this Nov 24, 2024

#111 [MOD] : RequiresApi 추가

feb72eb

chanubc reviewed Nov 24, 2024

View reviewed changes

sohyun127 reviewed Nov 24, 2024

View reviewed changes

Eonji-sw added 4 commits November 25, 2024 02:15

#111 [MOD] : 불필요한 코드 제거

83d3762

#111 [MOD] : 데이터 파라미터화 및 불필요한 코드 제거

ffe67cb

#111 [REFACTOR] : 불필요한 리컴포지션 방지

5d0b78d

#111 [MOD] : dummy data id 변경

9e3d9da

chanubc approved these changes Nov 24, 2024

View reviewed changes

feature/news/src/main/java/com/teamwable/news/notice/NewsNoticeRoute.kt Outdated Show resolved Hide resolved

feature/news/src/main/java/com/teamwable/news/notice/NewsNoticeItem.kt Show resolved Hide resolved

Eonji-sw added 2 commits November 25, 2024 02:35

#111 [MOD] : clickable 우선순위 수정

5f66b8d

#111 [MOD] : StringRes 추가

3a9a158

Eonji-sw merged commit aa91526 into develop Nov 24, 2024
1 check passed

Eonji-sw deleted the feature/#111-news-notice-ui branch November 24, 2024 17:41

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Feature/#111 news notice UI #116

Feature/#111 news notice UI #116

Eonji-sw commented Nov 24, 2024

chanubc left a comment

chanubc Nov 24, 2024

Eonji-sw Nov 24, 2024

chanubc Nov 24, 2024

chanubc Nov 24, 2024

Eonji-sw Nov 24, 2024

chanubc Nov 24, 2024

chanubc Nov 24, 2024

chanubc Nov 24, 2024

Eonji-sw Nov 24, 2024

chanubc Nov 24, 2024

chanubc Nov 24, 2024

sohyun127 Nov 24, 2024

Eonji-sw Nov 24, 2024

sohyun127 Nov 24, 2024

chanubc left a comment

sohyun127 commented Nov 24, 2024

	items(notices) { notice ->
	items(items = notices, key = {item -> item.id}) {

Feature/#111 news notice UI #116

Feature/#111 news notice UI #116

Conversation

Eonji-sw commented Nov 24, 2024

✅ 𝗖𝗵𝗲𝗰𝗸-𝗟𝗶𝘀𝘁

📌 𝗜𝘀𝘀𝘂𝗲𝘀

📎𝗪𝗼𝗿𝗸 𝗗𝗲𝘀𝗰𝗿𝗶𝗽𝘁𝗶𝗼𝗻

📷 𝗦𝗰𝗿𝗲𝗲𝗻𝘀𝗵𝗼𝘁

💬 𝗧𝗼 𝗥𝗲𝘃𝗶𝗲𝘄𝗲𝗿𝘀

chanubc left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

chanubc left a comment

Choose a reason for hiding this comment

sohyun127 commented Nov 24, 2024